<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>TPMS</title>
<link href="jquery.mobile.theme-1.3.0.min.css" rel="stylesheet" type="text/css"/>
<link href="jquery.mobile.structure-1.3.0.min.css" rel="stylesheet" type="text/css"/>
<script src="jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="jquery.mobile-1.3.0.min.js" type="text/javascript"></script>
</head> 

<body >

    <div data-role="page" id="pnMainPage" data-theme="b" data-mini="true" >
        <div data-role="header" data-theme="b">
            <h1 style="margin-top: 5px; margin-bottom: 5px;" >Translate Project Manager Studio
                <span id="spMonthYearTitle" style="display: block;font-size: 10px;">Octobar 2012</span>
            </h1>
        </div>
        <fieldset class="ui-grid-a">
            <div class="ui-block-a"></div>
            <div class="ui-block-b"><button type="submit" id="btnShowAddNewClient" data-theme="b" data-mini="true">Add new client</button></div>
        </fieldset>
        <ul data-role="listview" id="lstClients" style="color: #00EC00 !important;" data-mini="true"></ul>
    </div>

    <div data-role="page" id="pnClient" data-theme="b" data-mini="true" >
        <div data-role="header" data-theme="b">
            <a id="btnClientBack" data-icon="delete" data-role="button" data-mini="true">Back</a>
            <h1 >Project</h1>
            <a id="btnClientEdit" data-icon="check" data-role="button" data-mini="true">Edit</a>
        </div>
        <ul data-role="listview" style="color: #00EC00 !important;" data-mini="true">
            <li id="btnPricesForClient">
                <a style="display: inline-block; padding: 14px; font-size: 14px;">Price Aggred</a>
            </li>
            <li id="btnContacts">
                <a style="display: inline-block; padding: 14px; font-size: 14px;">Contacts</a>
            </li>
            <li id="btnProject">
                <a style="display: inline-block; padding: 14px; font-size: 14px;">Open Projects</a>
                <div class="ui-li-count" data-theme="a">0</div>
            </li>
            <li>
                <a style="display: inline-block; padding: 14px; font-size: 14px;" >Close Projects</a>
                <div class="ui-li-count" data-theme="a">0</div>
            </li>
            <li>
                <a style="display: inline-block; padding: 14px; font-size: 14px;" >Unpayed Projects</a>
                <div class="ui-li-count" data-theme="a">0</div>
            </li>
        </ul>
    </div>
    <div data-role="page" id="pnAddNewClient" data-theme="b" data-mini="true"  >
        <div data-role="header" data-theme="b">
            <a id="btnAddNewClientCancel" data-icon="delete" data-role="button" data-mini="true">Cancel</a>
            <h1 >Add/Change Client</h1>
            <a id="btnAddNewClientSave" data-icon="check" data-role="button" data-mini="true">Save</a>
        </div>
        <div style="margin: 10px;">
        <div data-role="collapsible" data-inset="false" data-collapsed="false">
            <h3>Client info</h3>
            <label for="Clientcode">Client code:</label>
            <input type="text" name="Clientcode" id="txtClientcode" value="" data-mini="true"  />
            <label for="name">Name:</label>
            <input type="text" name="name" id="txtName" value="" data-mini="true"  />
            <label for="Website">Web site:</label>
            <input type="text" name="Website" id="txtWebsite" value="" data-mini="true"  />
            <label for="VATNumber">VAT Number:</label>
            <input type="text" name="VATNumber" id="txtVATNumber" value="" data-mini="true"  />
            <label for="Country">Client currency:</label>
            <select name="Country" id="selClientcurrency"></select>
            <label>Time zone:</label>
            <select  id="selTimezone"></select>
            <label for="GeneralInfo">General Info:</label>
            <textarea  name="AdditionalNote" id="txtGeneralInfo" data-mini="true"  ></textarea>
        </div>
        <div data-role="collapsible" data-inset="false" >
            <h3>Postal address</h3>
            <div data-role="fieldcontain" style="margin: 5px;">
                <label for="Streetaddress">Street address:</label>
                <input type="text" name="Streetaddress" id="txtStreetaddress" value="" data-mini="true"  />
                <label for="City">City:</label>
                <input type="text" name="City" id="txtCity" value="" data-mini="true"  />
                <label for="State">State:</label>
                <input type="text" name="State" id="txtState" value="" data-mini="true"  />
                <label for="Country">Country:</label>
                <select name="Country" id="selCountry">

                </select>
                <label for="ZIPcode">ZIP code:</label>
                <input type="text" name="ZIPcode" id="txtZIPcode" value="" data-mini="true"  />
            </div>
        </div>
        <div data-role="collapsible" data-inset="false">
            <h3>Contact info</h3>
            <label for="Email1">E-mail1:</label>
            <input type="text" name="Email1" id="txtEmail1" value="" data-mini="true"  />
            <label for="Email2">E-mail2:</label>
            <input type="text" name="Email1" id="txtEmail2" value="" data-mini="true"  />
            <label for="Phone1">Phone1:</label>
            <input type="text" name="Phone1" id="txtPhone1" value="" data-mini="true"  />
            <label for="Phone2">Phone2:</label>
            <input type="text" name="Phone2" id="txtPhone2" value="" data-mini="true"  />
            <label for="Phone3">Phone3:</label>
            <input type="text" name="Phone3" id="txtPhone3" value="" data-mini="true"  />
            <label for="Phone4">Phone4:</label>
            <input type="text" name="Phone4" id="txtPhone4" value="" data-mini="true"  />
            <label for="Fax">Fax:</label>
            <input type="text" name="Fax" id="txtFax" value="" data-mini="true"  />
            <label for="Note">Note:</label>
            <textarea  name="Note" id="txtNoteClient" data-mini="true"  ></textarea>
        </div>
        <div data-role="collapsible" data-inset="false">
            <h3>Payment terms</h3>
            <label>Minimum fee:</label>
            <div >
                <div style="width: 33%;display: inline-block;"><input type="number" id="txtMinimumfee" value="" data-mini="true" /></div>
                <div style="width: 60%; display: inline-block;"><label style="font-size:14px;">(0 - No Minimum fee)</label></div>
            </div>
            <div>
                <div style="width: 33%; display: inline-block;">
                    <fieldset data-role="controlgroup" data-mini="true">
                        <input type="radio" name="radio-choice" id="radio-choice-1" value="choice-1" checked="checked" />
                        <label for="radio-choice-1">Within</label>
                    </fieldset>
                </div>
                <div style="width: 20%; display: inline-block; position: relative; top: -2px;"><input type="number" id="txtIDTValue1" value="" data-mini="true"  /></div>
                <div style="width: 44%; display: inline-block;"><label style="font-size:14px;">days</label></div>
            </div>
            <div>
                <div style="width: 33%; display: inline-block;">
                    <fieldset data-role="controlgroup" data-mini="true">
                        <input type="radio" name="radio-choice" id="radio-choice-2" value="choice-2"  />
                        <label for="radio-choice-2">On day </label>
                    </fieldset>
                </div>
                <div style="width: 20%; display: inline-block; position: relative; top: -2px;"><input type="number" id="txtIDTValue2" value="" data-mini="true"  /></div>
                <div style="width: 44%; display: inline-block;"><label style="font-size:14px;">of the same month</label></div>
            </div>
            <div>
                <div style="width: 33%; display: inline-block;">
                    <fieldset data-role="controlgroup" data-mini="true">
                        <input type="radio" name="radio-choice" id="radio-choice-3" value="choice-3"  />
                        <label for="radio-choice-3">On day</label>
                    </fieldset>
                </div>
                <div style="width: 20%; display: inline-block; position: relative; top: -2px;"><input type="number" id="txtIDTValue3" value="" data-mini="true"  /></div>
                <div style="width: 44%; display: inline-block;"><label style="font-size:14px;">of the next month</label></div>
            </div>
            <div>
                <div style="width: 33%; display: inline-block;">
                    <fieldset data-role="controlgroup" data-mini="true">
                        <input type="radio" name="radio-choice" id="radio-choice-4" value="choice-4"  />
                        <label for="radio-choice-4">On day</label>
                    </fieldset>
                </div>
                <div style="width: 20%; display: inline-block; position: relative; top: -2px;"><input style="position: relative; top: 0px;" type="number" id="txtIDTValue4" value="" data-mini="true"  /></div>
                <div style="width: 44%; display: inline-block; height: 25px;"><label style="font-size:14px;">of the mouth fallowing next</label></div>
            </div>
            <label for="AdditionalNote">Additional Note:</label>
            <textarea  name="AdditionalNote" id="txtAdditionalNote" data-mini="true"  ></textarea>
        </div>
        <div data-role="collapsible" data-inset="false">
            <h3>Invoicing Policy</h3>
            <fieldset data-role="controlgroup" data-mini="true">
                <input type="radio" name="radio-choice-11" id="radio-choice-11" checked="checked" />
                <label for="radio-choice-11">Immediately after completing job</label>
            </fieldset>
            <fieldset data-role="controlgroup" data-mini="true">
                <input type="radio" name="radio-choice-11" id="radio-choice-12"  />
                <label for="radio-choice-12">Only after total of invoiced jobs reaches</label>
            </fieldset>
            <div style="width: 30%; margin-left: 15px;">
                <input type="number" id="txtJobReach" value="0" data-mini="true"   />
            </div>
            <div style=" margin-left: 15px;">
                <input type="checkbox" name="checkbox-0" id="checkbox-mini-0" class="custom" data-mini="true" />
                <label for="checkbox-mini-0">Wait accrual no longer then</label>
            </div>
            <div style="width: 30%; margin-left: 30px;">
                <input type="number"  id="txtWait" value="0" data-mini="true"  />
            </div>
        </div>
        </div>

    </div>

    <div data-role="page" id="pnContacts" data-theme="b" data-mini="true" >
        <div data-role="header" data-theme="b">
            <a id="btnContactsBack" data-icon="delete" data-role="button" data-mini="true">Back</a>
            <h1 >Clients</h1>
            <a id="btnAddContact" data-icon="check" data-role="button" data-mini="true">Add Client</a>
        </div>
        <ul data-role="listview" id="lstContacts" style="color: #00EC00 !important;" data-mini="true"></ul>
    </div>
    <div data-role="page" id="pnAddNewClientContact" data-theme="b" data-mini="true" >
        <div data-role="header" data-theme="b">
            <a id="btnAddNewClientContactCancel" data-icon="delete" data-role="button" data-mini="true">Cancel</a>
            <h1 >Add/Change Client Contact</h1>
            <a id="btnAddNewClientContactSave" data-icon="check" data-role="button" data-mini="true">Save</a>
        </div>
        <div data-role="fieldcontain">
            <label >Salutation:</label>
            <select id="selSalutation">
                <option value="Mr.">Mr.</option>
                <option value="Mrs.">Mrs.</option>
                <option value="Ms.">Ms.</option>
            </select>
            <label >Contakt name:</label>
            <input type="text" data-mini="true" name="test" id="txtContactName"  />
            <label >Position:</label>
            <input type="text" name="name" data-mini="true" id="txtCompanyPosition" />
        </div>
        <div data-role="fieldcontain">
            <label >E-mail 1:</label>
            <input type="text" name="name" data-mini="true" id="txtEmailContact1" />
            <label >E-mail 2:</label>
            <input type="text" name="name" data-mini="true" id="txtEmailContact2" />
            <label >Phone 1:</label>
            <input type="text" name="name" data-mini="true" id="txtPhoneContact1" />
            <label >Phone 2:</label>
            <input type="text" name="name" data-mini="true" id="txtPhoneContact2" />
            <label >Phone 3:</label>
            <input type="text" name="name" data-mini="true" id="txtPhoneContact3" />
            <label >Phone 4:</label>
            <input type="text" name="name" data-mini="true" id="txtPhoneContact4" />
            <label >Fax:</label>
            <input type="text" name="name" data-mini="true" id="txtFaxContact" />
        </div>
        <div data-role="fieldcontain">
            <label >Note:</label>
            <textarea  name="AdditionalNote" id="txtContactNote" data-mini="true"  ></textarea>
        </div>

    </div>

    <div data-role="page" id="pnPriceForClient" data-theme="b" data-mini="true" >
        <div data-role="header" data-theme="b">
            <a id="btnPriceForClientBack" data-icon="delete" data-role="button" data-mini="true">Back</a>
            <h1 >Clients</h1>
            <a id="btnAddPriceForClient" data-icon="check" data-role="button" data-mini="true">Add Price</a>
        </div>
        <ul data-role="listview" id="lstPricesForClient" style="color: #00EC00 !important;" data-mini="true"></ul>
    </div>
    <div data-role="page" id="pnPriceFC" data-theme="b" data-mini="true" >
        <div data-role="header" data-theme="b">
            <a id="btnPriceFCBack" data-icon="delete" data-role="button" data-mini="true">Back</a>
            <h1 >Price</h1>
            <a id="btnPriceFCEdit" data-icon="check" data-role="button" data-mini="true">Save</a>
        </div>
        <fieldset class="ui-grid-a">
            <div class="ui-block-a"><label>Groups of services:</label></div>
            <div class="ui-block-b"></div>
        </fieldset>
        <select name="select-choice-min" id="selGroupsOfServices"  data-mini="true"></select>
        <fieldset class="ui-grid-a">
            <div class="ui-block-a"><label>Services:</label></div>
            <div class="ui-block-b"></div>
        </fieldset>
        <select name="select-choice-min" id="selServices"  data-mini="true"></select>
        <fieldset class="ui-grid-a">
            <div class="ui-block-a"><label>Volume units:</label></div>
            <div class="ui-block-b"></div>
        </fieldset>
        <select name="select-choice-min" id="selVolumeUnits"  data-mini="true"></select>
        <fieldset class="ui-grid-a">
            <div class="ui-block-a"><label>Price:</label></div>
            <div class="ui-block-b"></div>
        </fieldset>
        <fieldset class="ui-grid-a">
            <div class="ui-block-a"><input type="text" name="name" data-mini="true" style="text-align: right;" alt="auto" id="txtPriceFC" /></div>
            <div class="ui-block-b"><label id="lblCurrency">EUR</label></div>
        </fieldset>

    </div>

    <div data-role="page" id="pnProject" data-theme="b" data-mini="true" >
        <div data-role="header" data-theme="b">
            <a id="btnProjectBack" data-icon="delete" data-role="button" data-mini="true">Back</a>
            <h1 >Project</h1>
            <a id="btnProjectSave" data-icon="check" data-role="button" data-mini="true">Save</a>
        </div>
        <div style="margin: 10px;">
            <div data-role="collapsible" data-inset="false" data-collapsed="false">
                <h3>Project info</h3>
                <fieldset class="ui-grid-a">
                    <div class="ui-block-a"><label for="ClientRef">Client Ref:</label></div>
                    <div class="ui-block-b"><input type="text" name="ClientRef" id="txtClientRef" value="" data-mini="true"  /></div>
                </fieldset>
                <label for="ProjectName">Name:</label>
                <input type="text" name="ProjectName" id="txtProjectName" value="" data-mini="true"  />
                <label>Priority:</label>
                <select  id="selPriority">
                    <option value="Low">Low</option>
                    <option value="Medium">Medium</option>
                    <option value="High">High</option>
                    <option value="Urgent">Urgent</option>
                </select>
                <label>Specialization:</label>
                <select  id="selSpecialization">
                    <option value="Education">Education</option>
                    <option value="Electronics">Electronics</option>
                    <option value="IT/Computers">IT/Computers</option>
                    <option value="Law/juridical">Law/juridical</option>
                    <option value="Marketing">Marketing</option>
                    <option value="Medicine/Pharmacy">Medicine/Pharmacy</option>
                    <option value="Oil and gas">Oil and gas</option>
                    <option value="Telecommunications">Telecommunications</option>
                </select>
                <label>Status:</label>
                <select  id="selStatus">
                    <option value="Active">Active</option>
                    <option value="Cancelled">Cancelled</option>
                </select>
            </div>
            <div data-role="collapsible" data-inset="false" data-collapsed="false">
                <h3>Project price</h3>
                <fieldset class="ui-grid-a">
                    <div class="ui-block-a"><label>Groups of services:</label></div>
                    <div class="ui-block-b"></div>
                </fieldset>
                <select name="select-choice-min" id="selGroupsOfServicesProject"  data-mini="true"></select>
                <fieldset class="ui-grid-a">
                    <div class="ui-block-a"><label>Services:</label></div>
                    <div class="ui-block-b"></div>
                </fieldset>
                <select name="select-choice-min" id="selServicesProject"  data-mini="true"></select>
                <fieldset class="ui-grid-a">
                    <div class="ui-block-a"><label>Volume:</label></div>
                    <div class="ui-block-b">Unit:</div>
                </fieldset>
                <fieldset class="ui-grid-a">
                    <div class="ui-block-a"><label><input type="text" name="name" data-mini="true" style="text-align: right;" alt="auto" id="txtVolumeProject" /></label></div>
                    <div class="ui-block-b"><select name="select-choice-min" id="selVolumeUnitsProject"  data-mini="true"></select></div>
                </fieldset>
                <fieldset class="ui-grid-a">
                    <div class="ui-block-a"><label>Price:</label></div>
                    <div class="ui-block-b">Type:</div>
                </fieldset>
                <fieldset class="ui-grid-a">
                    <div class="ui-block-a"><label><input type="text" name="name" data-mini="true" style="text-align: right;" alt="auto" id="txtPriceProject" /></label></div>
                    <div class="ui-block-b"><select name="select-choice-min" id="selPriceTypeProject"  data-mini="true">
                        <option value="per unit">per unit</option>
                        <option value="flat fee">flat fee</option>
                        <option value="free">free</option>
                    </select></div>
                </fieldset>
                <label id="lblTotal">Total:0.00</label>
            </div>
            <div data-role="collapsible" data-inset="false" data-collapsed="false">
                <h3>Time line</h3>
                <label >Assigned:</label>
                <input type="date" name="name" data-clear-btn="true" data-mini="true" id="txtAssignedDate" />
                <label >Deadline:</label>
                <input type="date" name="name" data-clear-btn="true" data-mini="true" id="txtDeadlineDate" />
                <label >&nbsp;</label>
                <input type="checkbox" name="checkbox-0" id="chbCompleted" class="custom" data-mini="true" />
                <label for="chbCompleted">Completed</label>
            </div>
            <div data-role="collapsible" data-inset="false" data-collapsed="false">
                <h3>Instructions</h3>
                <textarea  name="AdditionalNote" id="txtInstructions" data-mini="true"  ></textarea>
            </div>
            <div data-role="collapsible" data-inset="false" data-collapsed="false">
                <h3>Work notes</h3>
                <textarea  name="AdditionalNote" id="txtWorkNotes" data-mini="true"  ></textarea>
            </div>
        </div>
    </div>

    <script src="autoNumeric-1.7.5.js" type="text/javascript"></script>
    <script type="text/javascript">
        jQuery(function($) {
            $('input[alt="auto"]').autoNumeric({aSep: ',', aDec: '.'});
            $('input.int').autoNumeric({aSep: ',', aDec: '.',mDec:0, aPad: false });
        });
    </script>

    <script type="text/javascript" src="DataBase.js"></script>
    <script type="text/javascript" src="Helper.js"></script>
    <script type="text/javascript" src="Main.js"></script>
    <script type="text/javascript" src="Windows.js"></script>
    <script type="text/javascript" src="AddNewClient.js"></script>
    <script type="text/javascript" src="Client.js"></script>
    <script type="text/javascript" src="Project.js"></script>
    <script type="text/javascript" src="Contacts.js"></script>
    <script type="text/javascript" src="AddNewContact.js"></script>
    <script type="text/javascript" src="PricesForClient.js"></script>
    <script type="text/javascript" src="PriceForClient.js"></script>
    <script type="text/javascript" src="AddNewProject.js"></script>
</body>
</html>